<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('题目修改')"/>
</head>
<body>
<form class="layui-form" action="">
    <div class="mainBox">
        <div class="main-container">
            <div class="main-container">
                <input type="hidden" th:value="${question.questionId}" name="questionId">
                <div class="layui-form-item">
                    <label class="layui-form-label my-red-star">标题</label>
                    <div class="layui-input-block">
                        <input type="text" name="title" th:value="${question.title}" lay-verify="required"
                               autocomplete="off" placeholder="请输入"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">标签</label>
                    <div class="layui-input-block  fairy-tag-container">
                        <input type="text" id="tag" name="tag"   autocomplete="off" placeholder="请输入"
                               class="layui-input fairy-tag-input" onkeydown="if(event.keyCode==13){return false;}">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">类型</label>
                    <div class="layui-input-block">
                        <select name="questionType" lay-verify="required">
                            <option value=""></option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label my-red-star">解析</label>
                    <div class="layui-input-block">
                        <textarea type="text" id="edit" name="content" th:text="${question.content}"
                                  class="layui-textarea"></textarea>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="bottom">
        <div class="button-container">
            <button type="submit" class="pear-btn pear-btn-primary submit pear-btn-sm" lay-submit=""
                    lay-filter="user-update">
                <i class="layui-icon layui-icon-ok"></i>
                提交
            </button>
        </div>
    </div>
</form>
<th:block th:include="include :: footer"/>
<script th:inline="javascript">

    let editUrl = "/module/question/update"
    var datas = [[${@dict.getDict('questionType')}]];
    let questionType = [[${question.questionType}]];
    let tag = [[${question.tag}]];

    layui.use(['form', 'jquery', 'button', 'popup', "inputTag","tinymce"], function () {
        let form = layui.form;
        let $ = layui.jquery;
        var button = layui.button;
        var popup = layui.popup;
        let inputTag = layui.inputTag;
        let tinymce = layui.tinymce;

        $("#edit").text([[${question.content}]]);

        var tagObj1 = inputTag.render({
            elem: '#tag',
            data: tag.split(","),//初始值
            permanentData: [],//不允许删除的值
            removeKeyNum: 8,//删除按键编号 默认，BackSpace 键
            createKeyNum: 13,//创建按键编号 默认，Enter 键
            beforeCreate: function (data, value) {//添加前操作，必须返回字符串才有效
                console.log('beforeCreate', arguments);
                return value;
            },
            onChange: function (data, value, type) {
                console.log('onChange', arguments);
                // $('#tag1').text(JSON.stringify(data));
            }
        });

        // 编辑器
        var edit = tinymce.render({
            elem: "#edit",
            height: 450,
            images_upload_url: suffix + "/common/upload/text",
            automatic_uploads: true,
            convert_urls: false
        })



        let html = "<option value=\></option>";
        for (let i = 0; i < datas.length; i++) {
            if (questionType == datas[i].dataValue) {
                console.log("true")
                html += "<option selected value=\"" + datas[i].dataValue +
                    "\" >" + datas[i].dataLabel +
                    "</option>";
            } else {
                console.log("false")

                html += "<option value=\"" + datas[i].dataValue +
                    "\">" + datas[i].dataLabel +
                    "</option>";
            }
        }
        $("select[name='questionType']").html(html);
        form.render();

        form.on('submit(user-update)', function (data) {
            let btn = button.load({elem: '.submit'});
            data.field.tag = tagObj1.getData();
            data.field.content = edit.getContent();
            $.ajax({
                url: suffix + editUrl,
                data: data.field,
                dataType: 'json',
                type: 'post',
                success: function (result) {
                    btn.stop({
                        text: "提交",
                        elem: '.submit',
                        time: 1000,
                        done: function () {
                            if (result.success) {
                                layer.msg(result.msg, {icon: 1, time: 1000}, function () {
                                    parent.layer.close(parent.layer.getFrameIndex(window.name));//关闭当前页
                                    parent.layui.table.reload("user-table");
                                });
                            } else {
                                layer.msg(result.msg, {icon: 2, time: 1000});
                            }
                        }
                    })
                }
            })
            return false;
        });
    })
</script>
</body>
</html>
